<?php

include("islogged.php");

?>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
    <head>
        <link rel="icon" type="image/png" href="images/restapp.png" />
        <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
        <title>VUp - Amis</title>
        <link type="text/css" rel="stylesheet" href="css/table-sorter.css"
              media="screen" />
        <link type="text/css" rel="stylesheet" media="all" href="assets/datatable/css/demo_table_jui.css" >
		<link type="text/css" rel="stylesheet" media="all" href="assets/jquery-ui/css/redmond/jquery-ui-1.8.11.custom.css" >
		<link rel="stylesheet" href="css/style.css" type="text/css" >
		<script type="text/javascript" src="assets/js/jquery-1.5.2.min.js" ></script>
        <script type="text/javascript" src="assets/js/jquery-ajax-form-plugin/jquery.form.js" ></script>
        <script type="text/javascript" src="assets/datatable/jquery.dataTables.min.js"></script>
        <script type="text/javascript" src="assets/jquery-ui/js/jquery-ui-1.8.11.custom.min.js" ></script> 
    </head>
    <body>

        <div id='topmenu'>
		<div>
			<img style="float:left" src="images/logo.png" />
		</div>
		<ul>
				<li><a href="space.php">Home</a></li>
				<li><a href="signup.php">Signup</a></li>
				<li><a href="faq.php">FAQ</a></li>
				<li><a href="contact.php">Contact</a></li>
		</ul>
		<span id="money">1$</span>
		<img  src="images/home.png" onclick=" document.location.href='admin.php'" />
		<img  src="images/admprofile.png" onclick=" document.location.href='../editprofile.php'" />
		<img  src="images/disconnect.png" onclick=" document.location.href='disconnect.php'" />
        </div>

        <div id="limit">
            <div id="user">
                <h4><img src="images/loggedin.png" />Compte d'utilisateur</h4>
                <img id="image_profile" src="images/img_profile.png" />
                <div id="info_user">
                    <h3>Bonjour Admin</h3>
                    <a href="">Modifier le profile</a></div>
                <!--#info_user--></div>
            <!--#user-->
            <div id="operations">
                <ul>
					<h4>Categories</h4>
                    <li><a href="profile.php?id=1"><img src="images/profile.png" />Profile</a>
					</li>
					<li><a href="videos.php"><img src="images/video.png" />Videos</a>
					</li>
					</li>
					<li><a href="members.php"><img src="images/teacher.png" />Members</a>
					</li>
                </ul>
            </div>

            <div id="page">
			<h3>Manage Members</h3>
         <script type="text/javascript">
                var oTable;
                $(function() {
                    $('#delete').click(function() {
                        DeleteMember();
                    });

                    jQuery(document).ready(function() {

                    	oTable = jQuery('#tbl-member').dataTable({
                    	
                    		"bJQueryUI" : true,
                    		"sPaginationType" : "full_numbers",
							"aaSorting" : [ [ 1, "asc" ] ],
                    		"iDisplayLength": 10,
                    		"bProcessing" : true,
                    		"bServerSide" : true,
                    		"sAjaxSource" : "member_ac.php",
                            "fnServerData": function(sUrl, aoData, fnCallback) {
                                var data = "length="
                                        + (fnGetKey(aoData, "iDisplayLength"))
                                        + "&start="
                                        + (fnGetKey(aoData, "iDisplayStart"))
                                        + "&echo=" + (fnGetKey(aoData, "sEcho"))
										+ "&sort=" + (fnGetKey(aoData, "iSortCol_0"))
										+ "&sortdir="
										+ (fnGetKey(aoData, "sSortDir_0")) + "&texto="
										+ (fnGetKey(aoData, "sSearch"))+"&action=list";
                                $.ajax({
									"type": "POST",
                                    "url": sUrl,
                                    "data": data,
                                    "success": function(json) {
                                        fnCallback(json);
                                    },
                                    "dataType": "json",
                                    "cache": false
                                });
                            },	
                    		"aoColumns" : [ {"sWidth" : "3%","bSortable" : true },
                    		                {"sWidth" : "18%","bSortable" : true },
                    		                {"sWidth" : "18%","bSortable" : true },
                         	   {"sWidth" : "10%","bSortable" : true },
                         	   {"sWidth" : "8%","bSortable" : true },
							   {"sWidth" : "10%","bSortable" : true },
                         	   {"sWidth" : "3%","bSortable" : true }
                    	    ]
                    	});
                    	jQuery(".ui-corner-br").addClass('ui-widget-header_custom ');

                    });
                    
                   
                    $("#dialog-confirm-delete").dialog({
                        resizable: false,
                        height: 180,
                        modal: true,
                        autoOpen: false,
                        buttons: {
                            "Yes": function() {
                                var values = $("input:checked").getCheckboxValues();
                                var ids = "ids=";
                                values.forEach(function(item) {
                                    ids = ids + item + ",";
                                });
								ids = ids + "&action=delete";
                                $.ajax({
                                    type: "POST",
                                    url: "member_ac.php",
                                    data: ids,
                                    success: function(result) {

                                        if (result.error != null && result.error != "") {
                                            $("#dialog-confirm-delete").dialog("close");
                                            $("#dialog-modal-error").html("");
                                            $("#dialog-modal-error").html(result.error);
                                            $("#dialog-modal-error").dialog("open");

                                        } else {

                                            oTable.fnDeleteRow(0);
                                            $("#dialog-confirm-delete").dialog("close");
                                        }

                                    }
                                });
                            },
                            Cancel: function() {
                                $(this).dialog("close");
                            }
                        }
                    });
                    $("#dialog-modal").dialog({
                        height: 110,
                        modal: true,
                        autoOpen: false,
                        resizable: false
                    });
                    $("#dialog-modal-error").dialog({
                        height: 110,
                        modal: true,
                        autoOpen: false,
                        resizable: false
                    });

                });

                jQuery.fn.getCheckboxValues = function() {
                    var values = [];
                    var i = 0;
                    this.each(function() {
                        values[i++] = $(this).attr("name");
                    });
                    return values;
                }
                function DeleteMember() {
                    var arr = $("input:checked").getCheckboxValues();

                    if (arr.length == 0) {
                        $("#dialog-modal").dialog('open');
                    } else {
                        $("#dialog-confirm-delete").dialog('open');
                    }
                }
                function fnGetKey(aoData, sKey) {
                    for (var i = 0, iLen = aoData.length; i < iLen; i++) {
                        if (aoData[i].name == sKey) {
                            return aoData[i].value;
                        }
                    }
                    return null;
                }
            </script>			
                        <button  id="delete" type="button" class="blue">
                            <span>Delete</span>
                        </button>
						<br/>
                        <div class="container">
                            <table cellspacing="0" cellpadding="0" border="0" class="display"
                                   id="tbl-member">
                                <thead>
                                    <tr>
                                    <tr>
                                        <th>
                                        <input type="checkbox" name="check" class="checkall" />
                                        </th>
                                        <th>First name</th>
                                        <th>Last name</th>
                                        <th>Email</th>
                                        <th>Registration date</th>
										<th>Login</th>
                                        <th></th>
                                    </tr>
                                </thead>
                                <tbody>
                                </tbody>
                            </table>
                        </div>
			
            </div>
            <div id="dialog-confirm-delete" title="">
                <p>
                    <span class="ui-icon ui-icon-alert"
                          style="float: left; margin: 0 7px 20px 0;"></span>
                    Are you sure you want delete this?
                </p>
            </div>
            <div id="dialog-modal" title="">
                <p>
                    You have to select at less one row to delete!
                </p>
            </div>
            <div id="dialog-modal-error" title=""></div>
            <div id="copyrights"><span id="copytext">All rights reserved | Copyrights  2013 </span></div>

        </div>

    </body>
</html>